<template>
	<van-tabbar v-model="active" :fixed="true" :placeholder="true" :safe-area-inset-bottom="true">
		<van-tabbar-item replace to="/game_hall" icon="home-o">大厅</van-tabbar-item>
		<van-tabbar-item replace to="/friend_index" icon="friends-o">好友</van-tabbar-item>
		<van-tabbar-item replace to="/user_center" icon="setting-o">个人设置</van-tabbar-item>
	</van-tabbar>
</template>

<script>
import Vue from 'vue';
import { Tabbar, TabbarItem } from 'vant';

Vue.use(Tabbar);
Vue.use(TabbarItem);

export default {
	name : 'headerTop',
	data() {
		return {
			active: 0,
		};
	},
	created() {
		if (this.$route.name == "game_hall") {
			this.active = 0;
		} else if (this.$route.name == "friend_index") {
			this.active = 1;
		} else if (this.$route.name == "user_center") {
			this.active = 2;
		} 
	},
	methods: {}
};

</script>

<style>
	.van-nav-bar {
		background-color:#FFD801;
	}
</style>
